<template>
  <a-table :dataSource="orderList" :columns="columns" :pagination="false">
    <template #bodyCell="{ column, record }">
      <template v-if="column.key === 'image'">
        <img :src="`http://localhost:9763${record.image}`"
             style="border-radius: 10px; width: 60px; height: 60px">
      </template>
    </template>
  </a-table>
</template>

<script setup>
import {ref, onMounted} from "vue";
import {tansParams} from "@/utils";
import axios from "axios";

const userInfo = JSON.parse(localStorage.getItem("userInfo"))

const columns = ref([
  {title: '产品图片', dataIndex: 'image', key: 'image',},
  {title: '分类', dataIndex: 'productType', key: 'productType',},
  {title: '产品名称', dataIndex: 'productName', key: 'productName',},
  {title: '购买数量', dataIndex: 'num', key: 'num',},
  {title: '购买日期', dataIndex: 'buyDate', key: 'buyDate',},
])

const orderList = ref([])
const getOrderList = async () => {
  const params = {
    memberId: userInfo.id,
  }

  let url = 'http://localhost:9763/system/order/list?' + tansParams(params)
  url = url.slice(0, -1)
  const {data} = await axios.get(url)
  orderList.value = data.rows
}

onMounted(() => {
  getOrderList()
})

</script>

<style scoped>

</style>
